package com.latefly.skewwork.ui.page.practice

import androidx.compose.foundation.layout.BoxWithConstraints
import androidx.compose.material3.Button
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.layout.layoutId
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp
import androidx.constraintlayout.compose.ConstraintLayout
import androidx.constraintlayout.compose.ConstraintSet

@Composable
fun CoupleApi() {
    val margin = 16.dp
    ConstraintLayout {
        val (button1, text) = createRefs()
        Button(
            modifier = Modifier.constrainAs(button1) {
                top.linkTo(parent.top, margin)
            },
            onClick = { }
        ) {
            Text(text = "Button1")
        }
        Text(
            modifier = Modifier.constrainAs(text) {
                top.linkTo(button1.bottom, margin)
                centerAround(button1.end)
                centerHorizontallyTo(parent)
            },
            text = "Text"
        )
    }
}


//将两个约束拆解
@Composable
fun DecoupleApi() {
    BoxWithConstraints {
        val constraintSet = if (maxWidth < maxHeight) {
            decoupleConstraints(16.dp)
        } else {
            decoupleConstraints(50.dp)
        }
        ConstraintLayout(constraintSet = constraintSet) {
            Button(
                modifier = Modifier.layoutId("button"),
                onClick = { }
            ) {
                Text(text = "Button1")
            }
            Text(
                modifier = Modifier.layoutId("text"),
                text = "Text"
            )
        }
    }

}

private fun decoupleConstraints(margin: Dp): ConstraintSet {
    return ConstraintSet() {
        val button = createRefFor("button")
        val text = createRefFor("text")
        constrain(button) {
            top.linkTo(parent.top, margin)
        }
        constrain(text) {
            top.linkTo(button.bottom, margin)
        }
    }
}